<!DOCTYPE HTML>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>
        帐号操作
    </title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta
            name="viewport"
            content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">


    <meta name="format-detection" content="telephone=no">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    {% include 'public_css.html' %}
    <style>
        .bodybg {
            background-color: #272727;
            font-family: "微软雅黑";
        }
    </style>
</head>
<body class="bodybg">
<div align="center" class="container" style="padding-top:40px;margin-bottom: 10px">
    <div class="row" style="height:150px;border:11px solid white;">
        <h1 id="title" align="center">
            <B><span style="color: red">LOVER</span>
                <span style="color: orange;">HOUSE</span>
            </B>
        </h1>
        <div >
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true" style="background-color: red"></span>
        </div>
    </div>

    <div id="form_div" style="padding-top:10px;">
        <form method="POST" id="register_form" action="">
            <div class="form-group form-group-lg">
                <div class="input-group col-xs-11 col-md-11">
            <span class="input-group-addon" >
              本人邮箱
            </span>
                    <script type="text/javascript">
                        function checkEmail() {

                            var email = $("#myEmail").val();

                            $.get("/account/register/email/" + email + "/", function (data, status) {
                                if (status == "success") {
                                    $("#tipForEmail").html(data);

                                }
                            });
                        }
                    </script>

                    <input
                            id="myEmail"
                            name="myEmail"
                            type="email"
                            class="form-control"
                            placeholder="如QQ邮箱"
                            onchange="return checkEmail();"
                            aria-describedby="basic-addon1">

                </div>
                <p class="input-group col-xs-11 col-md-11" id="tipForEmail" align="left" style="color:red;"></p>


                <div class="input-group col-xs-11 col-md-11">
            <span class="input-group-addon" >
              设置密码
            </span>
                    <input
                            id="password"
                            name="password"
                            type="password"
                            class="form-control"
                            placeholder="密码"
                            aria-describedby="basic-addon1">

                </div>
                <p class="input-group col-xs-11 col-md-11" id="tipforpassword" align="left" style="color:red;"></p>

                <div class="input-group col-xs-11 col-md-11">
            <span class="input-group-addon" >
              对方邮箱
            </span>
                    <input
                            id="loverEmail"
                            name="loverEmail"
                            type="email"
                            class="form-control"
                            placeholder="如QQ邮箱"
                            aria-describedby="basic-addon1">

                </div>
                <p class="input-group col-xs-11 col-md-11" id="tipforloveremail" align="left" style="color:red;">
                </p>

                <div class="input-group col-xs-11 col-md-11">
            <span class="input-group-addon" id="basic-addon1">
              情侣口令
            </span>
                    <input
                            id="loverToken"
                            name="loverToken"
                            type="password"
                            class="form-control"
                            placeholder="情侣码"
                            aria-describedby="basic-addon1">

                </div>
                <p class="input-group col-xs-11 col-md-11" id="tipforlovertoken" align="left" style="color:red;">
                </p>

                <br>

                <div class="input-group col-xs-11 col-md-11">
                    <a class="btn btn-primary" type="submit" onclick="submitForm()" style="float:left;">完成注册</a>
                    <a class="btn btn-default" type="button" href="/account/login_page/" style="float:right;">
                        直接登录
                    </a>
                    <script type="text/javascript">
                        function submitForm() {
                            if ($("#myEmail").val() != "" && $("#password").val() != ""
                                    && $("#loverEmail").val() != "" && $("#loverToken").val() != "") {
                                $("#register_form").submit();
                            } else {
                                alert("所有项不可为空！");
                            }
                        }
                    </script>
                </div>
            </div>
            {% csrf_token %}
        </form>
    </div>
</div>
<br>
{% include 'public_footer.html' %} {% include 'public_js.html' %}
</body>
</html>
